import React from 'react';
import { Link, withRouter } from 'react-router-dom';
import { Breadcrumb} from 'antd';

const BreadCrumb = withRouter((props) => {
    let arrList = {};
    let arr = (data => {
        data.length &&
        data.forEach((item,index)=>{
            arrList[item.path] = {
                key:item.path,
                name:item.name
            };
            if(item.children){
                arr(item.children);
            }
        })
    });
    arr(window.routeConfig[2].routes);
    const { location } = props;
    //过滤第一项为空的路径
    const pathSnippets = location.pathname.split('/').filter(i => i);
    const extraBreadcrumbItems = pathSnippets.map((_, index) => {
        const url = `/${pathSnippets.slice(0, index + 1).join('/')}`;
        //url为每一小段link
        if(!arrList[url]){
            return true;
        }
        return (
            <Breadcrumb.Item key={url}>
                <Link to={url}>
                    {arrList[url]['name']}
                </Link>
            </Breadcrumb.Item>
        );
    });
    const breadcrumbItems = [(
        <Breadcrumb.Item key="home">
            <Link to="/">Home</Link>
        </Breadcrumb.Item>
    )].concat(extraBreadcrumbItems);
    return (
        <Breadcrumb>
            {breadcrumbItems}
        </Breadcrumb>
    );
});

export default BreadCrumb;